<template>
  <div>
    <div id="map"></div>
  </div>
</template>

<script setup>
import { onMounted, markRaw } from "vue";
import { useStore } from "../store";
import olMap from '../utils/olUtils'
const store = useStore();
onMounted(() => {
  const map = olMap.initOlMap();
  store.globalMap = markRaw(map);
 
  olMap.addPopup()
  olMap.addGraticule(map);
});
</script>

<style scoped>
#map {
  width: 100vw;
  height: 100vh;
  position: absolute;
  font-size: medium;
}
</style>
